<template>
  <div id = "app">
    <router-view :key="key"></router-view>
  </div>
</template>
<script>
export default {
  data () {
    return {
      uid: this.$root.uid,
      email: this.$root.email,
      username: this.$root.username,
      rolename: this.$root.rolename,
      activeIndex: this.$route.path,
      menuList: []
    }
  },
  watch: {
    $route: function () {
      this.activeIndex = this.$route.path
      // 特殊处理（当监听到的不是下拉菜单对应的路由时，需重新激活所选界面对应的路由）
      if (this.$route.path === '/') {
        this.$nextTick(() => { this.activeIndex = '/' })// 直播首页
      }
    }
  },
  mounted () {
    // __punch.to(this.username + this.email)
  },
  methods: {
  },
  computed : {//  解决路由改变 界面不刷新问题
    key(){
      return this.$route.name ? this.$route.name + new Date(): this.$route + new Date()
    }
  }
}
</script>
<style>
  @import '../static/css/style.css';
  @import '../static/owl-carousel/owl.carousel.css';
  @import '../static/owl-carousel/owl.theme.css';
  /*已经上CDN了*/
  /*@import '../static/font-awesome-4.4.0/css/font-awesome.min.css';*/
  @import '../static/css/zySearch.css';
html,
body {
  height: 100%;
  width: 100%;
}
.heightLimit {
  position:absolute;
  width:100%;
  min-height:100%;
  top:0;
}
.right-dialog {
  position: fixed;
  right: 0px;
  height: 100%;
  overflow: hidden;
  z-index: 999;
  top: 0px !important;
}
.right-dialog .el-dialog {
  transform: translateX(0);
  height: 100%;
  top: 0px !important;
  margin-bottom: 0px;
  overflow: auto;
  right: 0px;
  left: auto;
  min-width: 650px;
}
.right-dialog .el-dialog .el-dialog__body {
  padding: 10px 20px;
}
.right-dialog .el-dialog .el-dialog__footer {
  margin-top: -10px;
}
.el-table .cell,
.el-table th > div {
  padding-left: 5px;
  padding-right: 5px;
  box-sizing: border-box;
  text-overflow: ellipsis;
  background: transparent !important;
}
.el-form-item__label {
  font-weight: bold;
}
.header {
  background: #353f4e;
  height: 55px;
  position: relative;
}
.header .logo {
  width: 60px;
  height: 26px;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
}
.header .title {
  float: left;
  font-family: PingFangSC-Regular;
  font-size: 20px;
  color: #ffffff;
  width: 150px;
  height: 28px;
  position: absolute;
  top: 50%;
  margin-left: 80px;
  transform: translateY(-50%);
}
.header .menu {
  float: left;
  margin-left: 230px;
}
.header .right-menu {
  float: right;
  width: 100px;
}
.header .username {
  font-family: PingFangSC-Regular;
  font-size: 14px;
  color: #ffffff;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
}
.header .logout {
  font-family: PingFangSC-Regular;
  font-size: 14px;
  color: #ffffff;
  position: absolute;
  top: 50%;
  margin-left: 60px;
  transform: translateY(-50%);
}
.header .logout a {
  color: #fff;
  text-decoration: none;
}
.el-table__header th {
  background-color: #eff2f7;
}

.el-table th,
.el-table td {
  text-align: center;
}
.el-table,
.el-table__expanded-cell {
  background-color: transparent !important;
}
.el-table tr {
  background-color: transparent !important;
}
.el-tabs__content {
  height: calc(100% - 56px);
}

.el-tab-pane {
  height: 100%;
}
.el-main {
  overflow:hidden;
  min-height:200px;
  margin-bottom: 187px;
}

/* 弹窗 */
.el-dialog__header {
  height: 38px !important;
  padding: 15px 20px 0px 20px !important;
  background-color: #f3f3f3 !important;
}
.el-dialog__title {
  font-size: 16px !important;
  color: #333 !important;
  font-weight: 500 !important;
}
.el-dialog__headerbtn .el-dialog__close {
  color: #333 !important;
}
</style>
